import { defineComponent, ref } from 'vue';
// import Dialog from './components/dialog';
import Dialog from './dialog'
import Carousel from './components/3dCarousel';
import CodeDiff from './components/codeDiff'
const App = defineComponent({
  name: 'App',
  setup() {
    const dialogVisible = ref<boolean>(false);
    const methods = {
      control(status) {
        dialogVisible.value = status
      }
    }
    return () => (
      <div>
        {/* 弹窗 */}
        <Dialog
          v-model:visible={dialogVisible.value}
          modal={false}
          width={'30%'}
          append-to-body={false}
          draggable={true}
          v-slots={{
            header: () => {
              return <p>ltt通用弹窗</p>
            },
            default: () => {
              return <div>这是弹窗插件的内容</div>
            },
            footer: () => {
              return <>
                <el-button onClick={() => methods.control(false)}>取消</el-button>
                <el-button onClick={() => methods.control(false)}>确认</el-button>
              </>
            }
          }}
        />
        <el-button onClick={() => methods.control(true)}>打开弹窗</el-button>
        <Carousel />
        <CodeDiff
          dialog={false}
        />
      </div>
    )
  }
});

export default App;
